<div class="col-lg-12 mt-5 mx-auto animated fadeInRight">
  <mdb-card cascade="true" narrower="true">
    <!--Card image-->
    <div
      class="view view-cascade gradient-card-header amy-crisp-gradient narrower z-depth-2 rounded-lg  py-2 m-3 mt-n4 text-center">
      <div class="m-3">
        <h4 class="white-text">预约待审核情况一览</h4>
      </div>
    </div>
    <!--/Card image-->
    <table class="table table-striped table-responsive-md btn-table">
      <thead>
      <tr>
        <th>序号</th>
        <th>预约人姓名</th>
        <th>身份证号</th>
        <th>入住日期</th>
        <th>退房日期</th>
        <th>房间号</th>
        <th>备注</th>
        <th></th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let each of auditData;let i = index">
        <td>{{i + 1}}</td>
        <td>{{each.name}}</td>
        <td>{{each.idCard}}</td>
        <td>{{each.checkInDate}}</td>
        <td>{{each.checkOutDate}}</td>
        <td>{{each.roomNo}}</td>
        <td>{{each.comment}}</td>
        <td>
          <button type="button" class="btn btn-indigo btn-sm mr-2" (click)="auditPass(each.id)">通过</button>
          <button type="button" class="btn btn-danger btn-sm m-0" (click)="auditFail(each.id)">拒绝</button>
        </td>
        <!--/.Content-->
      </tr>
      </tbody>
    </table>
  </mdb-card>
</div>

